<template>
    <div class="production-plan">
        <!-- 保存按钮 -->
        <h3 class="title">生产退料信息</h3>
        <!-- 基本信息表单 -->
        <el-form ref="formRef" :model="formData" :rules="rules" label-position="right" label-width="80px">
            <el-row :gutter="20">
               <el-col :span="6">
                    <el-form-item label="编号">
                        <el-input v-model="formData.strippingId"  disabled/>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="单据主题">
                        <el-input v-model="formData.subject"  disabled/>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="单据编号">
                        <el-input v-model="formData.documentNumber"  disabled />
                    </el-form-item>
                </el-col>
                <el-col :span="10">
                    <el-form-item label="*退料日期" prop="returndate">
                        <el-date-picker
                                v-model="formData.returndate"
                                type="date"
                                required
                                disabled
                        ></el-date-picker>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="制单人员">
                        <el-input v-model="formData.operatorName" placeholder="请输入备注" disabled/>
                    </el-form-item>
                </el-col>
                <el-col :span="6">
                    <el-form-item label="备注">
                        <el-input v-model="formData.remark" disabled/>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <!-- 物料明细部分 -->

    </div>
</template>

<script setup>
import { ref, reactive, onMounted, watch } from 'vue';
import { ElMessage, ElMessageBox } from 'element-plus';
import { useRouter, useRoute } from 'vue-router';
import { Materialread, Materialwrite  } from '@/axios/axiosHelper';
import axios from 'axios';

const formRef = ref(null);
const currentUser = ref("admin");
const router = useRouter();
const route = useRoute();

// 主表单数据，使用驼峰命名规范，使变量命名更统一
const formData = reactive({
  "strippingId": route.query.strippingId,
      "subject": "",
      "documentNumber": "",
      "returndate": "",
      "operatorName": currentUser.value,
      "remark": "",
      "documentNo": "",
      "isDel": false
});



const getProductionById = (strippingId) => {
  console.log('查看反填数据:', strippingId);
  axios.get('https://localhost:7278/api/GStripping/FTStripping', {
      params:{
        strippingId: route.query.strippingId
      }
    })
    .then(res=>{
      formData.subject = res.data.data[0].subject;
      formData.subject = res.data.data[0].subject;
      formData.documentNumber = res.data.data[0].documentNumber;
      formData.returndate = res.data.data[0].returndate;
      formData.operatorName = res.data.data[0].operatorName;
      formData.remark = res.data.data[0].remark;
      formData.documentNo = res.data.data[0].documentNo;
      formData.modelValue = res.data.data[0];
      console.log('反填数据:', res.data);
    })
};
const saveAll = () => {
    // 这里可以添加保存主表单和明细的逻辑
    ElMessage.warning('保存功能待实现');
};

onMounted(() => {
    getProductionById();
});
</script>

<style scoped>
.production-plan {
    padding: 20px;
}

.title {
    text-align: center;
    margin-bottom: 20px;
}

.sub-title {
    margin: 20px 0 10px;
    font-size: 16px;
    font-weight: 500;
}

.detail-section,
.attachment-section {
    margin-top: 20px;
}

.el-table {
    margin-top: 10px;
}
</style>